<template>
    <a-layout-content :style="{ overflow: 'initial' }">
      <div class="nav_word_box ">
        <div style="display:flex;align-items:center;">
          <img
            style="width:25px;height:25px;border-radius:18px;margin-right:5px;"
            src="../assets/img/logo.png"
            alt=""
          />
          <!-- <span class="nav_word_text">山东省文化和旅游惠民消费季商家后台</span> -->
          <span class="nav_word_text">飞羊智慧门店管理中心</span>
        </div>
        <div
          class="quit_"
          style="height:64px;width:100px;display:flex;align-items: center;
  }"
          @click="quitFunc"
        >
         <span class='iconfont icon-tuichu1' style="margin-right:2px;"></span>
         <span>退出登录</span>
  
        </div>
      </div>
  
      <div class="basic_info_content_box" :style="{ minHeight: '800px' }" v-if="agreeShow==false">
  
        <div class="create_store_box">
          <div class="create_left_box">
            <img src="http://feiyangimage.oss-cn-shanghai.aliyuncs.com/d_logo.png" alt="">
            <div class="create_store_name_box">
              <span>{{phone}}</span>
              <!-- <div class="pwd_account_box">
                <span @click="modifyPwdFunc">修改密码</span>
                <span @click.stop="deleteAccountFunc" style="margin-left:12px">账号注销</span>
              </div> -->
            </div>
          </div>
          <!-- <div class="create_right_box" @click="applyClick">创建店铺</div> -->
        </div>
        <div class="store_word">拥有的店铺：</div>
        <div>
          <ul>
            <li
              v-for="(item, index) in storeList"
              :key="index"
              class='loading_class'
              @click="selectStoreClick(index)"
              :style="
                selectStoreIndex == index
                  ? 'background-color:#efeff2'
                  : 'background-color:white'
              "
            >
                <div>
                  <img :src="item.storeImage" alt=""  />
                  <span>{{ item.name }}</span>
                </div>
  
                <div class="close_store_box">
                  <span @click.stop="mainDeleteStoreFunc(item)" style="color:rgba(245, 34, 45, 1);margin-right:12px">注销</span>
                  <!-- <span v-if="this.userType!=2"  @click.stop="mainQuitStoreFunc" >主-退出</span>
                  <span v-if="this.userType==2" @click.stop="subQuitStoreFunc" >子-退出</span> -->
                  <span  @click.stop="quitTypeFunc" >退出</span>
                  
                </div>
            
            </li>
          </ul>
        </div>
      </div>

      <a-modal
        v-model="deleteAccountShow"
        title="账号注销"
        :width="550"
      >
      <template #footer>
          <a-button key="back" @click="handleCancel">取消</a-button>  
          <a-button key="submit" type="primary" style="background:rgba(245, 34, 45, 1);border:none"  @click="handleAccountDeleteOk">确定注销账号</a-button>
        </template>
       <div class="delete_info_box">
        <a-icon type="exclamation-circle" style="color:#d4b754;font-size:21px;margin-right: 10px;" />
        <div>
          <span>你的帐号18258298888即将被注销，帐号注销后，将放弃智慧门店所有资产和权益，请谨慎操作！注销店铺前，请退出所有门店或将所有权门店注销成功，否则将无法注销。</span>
        </div>
        
       </div>
       <div class="account_mark">
        <span> <span class="iconfont icon-dian"></span>身份、帐号信息、会员权益等资产将清空且无法恢复；</span>
        <span><span class="iconfont icon-dian"></span>帐号注销后视作你自动放弃所有权益； </span>
        <span> <span class="iconfont icon-dian"></span>身份、帐号信息、会员权益等资产将清空且无法恢复；</span>
        <span><span class="iconfont icon-dian"></span>交易记录、核销员身份将清空；</span>
        <div style="display: flex;flex-shrink:0;"><span class="iconfont icon-dian"></span><span style="flex-shrink:0;">帐号一旦被注销将不可恢复，请在操作之前自行备份帐号相关的所有信息和数</span></div>
        <span><span class="iconfont icon-dian" style="visibility:hidden"></span>据； </span>
        <span><span class="iconfont icon-dian"></span>帐号注销不代表注销前的帐号行为和相关责任得到豁免或减轻。</span>
        
       </div>
       <div class="code_box">
        <span style="color:rgba(0, 0, 0, 0.65);margin-top:10px;"><span style="color:red;">*</span>短信验证码：</span>
        <div class="code_right">
          <div class="input_code">
              <a-input
              v-model="inputCode"
              style="width:302px; margin-right: 6px;height: 40px; "
              placeholder="请输入验证码"
            />
            <div class="get_code_btn">获取验证码</div>
          </div>
          <span style="margin:10px 0;">验证短信将发送至店铺主账号的手机：{{phone}}，请注意查收</span>
          <div>
            <a-checkbox :checked="agreeValue" @change="onAgreeChange">
              
            </a-checkbox>
             <span style="margin-left:4px;">我已仔细阅读 <span style="color:rgba(24, 144, 255, 1);" @click="agreePageFunc(2)">《账号注销协议》</span>并同意</span>
          </div>
  
        </div>
       </div>
      </a-modal>
      
  
  
      <a-modal
        v-model="mainDeleteStoreShow"
        title="注销店铺"
        :width="550"
      >
      <template #footer>
          <a-button key="back" @click="handleCancel">取消</a-button>
          <a-button key="submit" type="primary" style="background:rgba(245, 34, 45, 1);border:none"  @click="handleMainDeleteStoreOk">确定注销店铺</a-button>
        </template>
       <div class="delete_info_box">
        <a-icon type="exclamation-circle" style="color:#d4b754;font-size:21px;margin-right: 10px;" />
        <div>
          <span>注销店铺，所有店铺相关信息将丢失，店铺购买的应用和业务失效且不予退款，请谨慎操作！注销店铺前，请确认以下操作已完成： <br/>① 完成当前门店所有未完成状态的订单； <br/>② 提取当前门店所有资金，若不提取，则系统自动回收，概不退回！</span>
        </div>
        
       </div>
       <div class="code_box">
        <span style="color:rgba(0, 0, 0, 0.65);margin-top:10px;"><span style="color:red;">*</span>短信验证码：</span>
        <div class="code_right">
          <div class="input_code">
              <a-input
              v-model="inputCode"
              style="width:302px; margin-right: 6px;height: 40px; "
              placeholder="请输入验证码"
            />
            <div v-if="getCodeWordshow" class="get_code_btn" @click="getCodeClick">获取验证码</div>
            <div v-if="!getCodeWordshow"  class="get_code_btn" >{{ times }}s</div>
  
  
          </div>
          <span style="margin:10px 0;">验证短信将发送至店铺主账号的手机：{{phone}}，请注意查收</span>
          <div>
            <a-checkbox :checked="agreeValue" @change="onAgreeChange">
              
            </a-checkbox>
             <span style="margin-left:4px;">我已仔细阅读 <span style="color:rgba(24, 144, 255, 1);" @click="agreePageFunc(1)">《店铺注销协议》</span>并同意</span>
          </div>
  
        </div>
       </div>
      </a-modal>
      
  
      <a-modal
        v-model="subQuitStoreShow"
        title="退出店铺"
        :width="550"
      >
      <template #footer>
          <a-button key="back" @click="handleCancel">取消</a-button>
          <a-button key="submit" type="primary" style="background:rgba(245, 34, 45, 1);border:none"  @click="handleSubQuitStoreOk">确定退出店铺</a-button>
        </template>
       <div class="delete_info_box">
        <a-icon type="exclamation-circle" style="color:#d4b754;font-size:21px;margin-right: 10px;" />
        <div>
          <span>退出店铺即代表解除与当前店铺的关系，以后将不能登录此店铺后台，且之前店铺内的信息也将无法看到，请谨慎操作！</span>
        </div>
        
       </div>
  
       <div class="line_box"  style="margin-top:24px;">
        <span style=" width: 90px;
    flex-shrink: 0;color:rgba(0, 0, 0, 0.65);text-align: right;margin-right:10px;"><span style="color:red;">*</span>退出店铺：</span>
        <span >店铺名称1111</span>
       </div>
       <div class="line_box" style="margin-top:24px;">
        <span style=" width: 90px;
    flex-shrink: 0;color:rgba(0, 0, 0, 0.65);text-align: right;margin-right:10px;"><span style="color:red;">*</span>退出原因：</span>
         <a-input
              style=" height: 40px;"
              placeholder="请输入退出原因，限50字"
            />
       </div>
       
       <div class="code_box">
        <span style="color:rgba(0, 0, 0, 0.65);margin-top:10px; width: 90px;
    flex-shrink: 0;"><span style="color:red;">*</span>短信验证码：</span>
        <div class="code_right">
          <div class="input_code">
              <a-input
              v-model="inputCode"
              style="width:302px; margin-right: 6px;height: 40px;"
              placeholder="请输入验证码"
            />
            <div class="get_code_btn">获取验证码</div>
          </div>
          <span style="margin:10px 0;">验证短信将发送至你的手机：18258298888，请注意查收</span>
        
  
        </div>
       </div>
      </a-modal>
      <a-modal
        v-model="mainQuitStoreShow"
        title="退出店铺"
        :width="550"
      >
      <template #footer>
          <a-button key="back" @click="handleCancel">取消</a-button>
          <a-button key="submit" type="primary" style="background:rgba(245, 34, 45, 1);border:none"  @click="handleMainQuitStoreOk">确定退出店铺</a-button>
        </template>
       <div class="delete_info_box">
        <a-icon type="exclamation-circle" style="color:#d4b754;font-size:21px;margin-right: 10px;" />
        <div>
          <span>主账号退出店铺即代表解除与当前店铺的关系，以后将不能登录此店铺后台，且之前店铺内的信息也将无法看到，请谨慎操作！ <br/>退出前，请将店铺所有权移交子账号，否则无法退出； <br/>无子账号可进行注销店铺或添加子账号。</span>
        </div>
        
       </div>
  
       <div class="line_box"  style="margin-top:24px;">
        <span style=" width: 90px;
    flex-shrink: 0;color:rgba(0, 0, 0, 0.65);text-align: right;margin-right:10px;"><span style="color:red;">*</span>退出店铺：</span>
        <span >店铺名称1111</span>
       </div>
       <div class="line_box" style="margin-top:24px;">
        <span style=" width: 90px;
    flex-shrink: 0;color:rgba(0, 0, 0, 0.65);text-align: right;margin-right:10px;"><span style="color:red;">*</span>移交店铺：</span>
        <a-select
                  placeholder="请选择子账号"
                  style="width: 338px"
                  :value="transferStore"
                  @change="handleStoreChange"
                >
                  <a-select-option
                    v-for="(item, index) in subAccountList"
                    :key="index"
                    :value="item"
                  >
                    {{ item }}
                  </a-select-option>
                </a-select>
       </div>
       
       <div class="code_box">
        <span style="color:rgba(0, 0, 0, 0.65);margin-top:10px; width: 90px;
    flex-shrink: 0;"><span style="color:red;">*</span>短信验证码：</span>
        <div class="code_right">
          <div class="input_code">
              <a-input
              v-model="inputCode"
              style="width:302px; margin-right: 6px;height: 40px;"
              placeholder="请输入验证码"
            />
            <div class="get_code_btn">获取验证码</div>
          </div>
          <span style="margin:10px 0;">验证短信将发送至你的手机：18258298888，请注意查收</span>
        
  
        </div>
       </div>
      </a-modal>
    </a-layout-content>
  </template>
  <script>
  import {
    GETSTORELISTAPI,

    GETALLINPAYSTOREINFOAPI,
    GETSTOREFIRSTCHECKINFOAPI,

    GETSTORELISTBYTYPEAPI,
    sendStoreLogoutMsgCodeAPI,
    storeLogoutAPI 
  } from "../api/index.js";
  import { mapGetters } from "vuex";
  function getBase64(img, callback) {
    const reader = new FileReader();
    reader.addEventListener("load", () => callback(reader.result));
    reader.readAsDataURL(img);
  }
  export default {
    data() {
      return {
        userId:"",
        inputCode:"",
        agreeValue:false,
        phone:'',
        currentItem:{},
        telephone:'',
        agreeType:1,// 1店铺 2账号
        agreeShow:false,
        deleteAccountShow:false,
        transferStore:undefined,
        subAccountList: [
          "中国银行",
          "中国建设银行",
          "中国农业银行",
          "中国工商银行",
          "广发银行",
          "交通银行",
          "浦东发展银行",
          "枣庄银行",
          "农村信用社",
          "光大银行",
          "中国民生银行",
          "招商银行",
          "找不到？手动输入"
        ],
        subQuitStoreShow:false,
        mainQuitStoreShow:false,
        mainDeleteStoreShow:false,
        selectStoreIndex: -1,
        loading: false,
        imageUrl: "",
        times: 60,
        getCodeWordshow: true, // getCodeWordshow 用于控制显示获取验证码和读秒，true：显示获取验证码  false：显示读秒
        storeList: [
          // {
          //   storeName:'店铺1',
          //   img:require('../../assets/images/login_ad.jpg')},
          //   {
          //   storeName:'店铺2',
          //   img:require('../../assets/images/login_ad.jpg')},
          //   {
          //   storeName:'店铺3',
          //   img:require('../../assets/images/login_ad.jpg')},
        ]
      };
    },
    mounted() {
     
      var json = JSON.parse(this.cbUserInfo);
      this.phone = json.phone;
      this.userId = json.id;
      this.getStoreListFunc();
    },
   computed: {
      ...mapGetters(["cbStoreId","cbStoreInfo","cbUserInfo","userType","cbToken","cbUserId"]),
    },
    methods: {
  
      getStoreListFunc(){
    
      var jsonParams = {
                userId: this.cbUserId,
                token: this.cbToken,
                type: 1
             };
             console.log('aa-dsd---',jsonParams);

            this.$http
          .post(
            this.globalRequestUrl.GETSTORELISTBYTYPEAPI,
            this.qs.stringify(jsonParams)
          )
          .then((res) => {
            if (res.data.status == 200) {
              console.log("GETSTORELISTBYTYPEAPI---", res);
              this.storeList = res.data.data;

          
            } else {
              this.$message.error(res.data.msg);
            }
          })
          .catch(function (err) {
            // this.$message.error("服务器错误，请检查！");
          });



      },
      quitTypeFunc(){
        this.$message.warning('功能升级，暂停使用 ...');
          // if(this.userType==2){
          //   this.subQuitStoreFunc();
          // }else{
          //   this.mainQuitStoreFunc();
          // }
      },
      applyClick() {
        console.log("申请提交--点击");
        this.$router.push("/apply");
      },
      modifyPwdFunc(){
        this.$router.push("/forgetPwd");
      },
      getCodeClick() {
      
        // sendStoreLogoutMsgCodeAPI({telephone:this.currentItem.mobile, storeId: this.currentItem.id,}).then(res => {
        //   console.log("res为", res);
        //   if (res.status != 200) {
        //     this.$message.warning(res.msg);
        //     return;
        //   }
        //   this.getCodeWordshow = false;
        //   this.timer = setInterval(() => {
        //     this.times--;
        //     if (this.times === 0) {
        //       this.getCodeWordshow = true;
        //       this.times = 60;
        //       clearInterval(this.timer);
        //     }
        //   }, 1000);
        // });


        var jsonParams = {
                userId: this.cbUserId,
                token: this.cbToken,
                telephone:this.currentItem.mobile, storeId: this.currentItem.id,
             };
             console.log('aa-dsd---',jsonParams);

            this.$http
          .post(
            this.globalRequestUrl.sendStoreLogoutMsgCodeAPI,
            this.qs.stringify(jsonParams)
          )
          .then((res) => {
            if (res.data.status == 200) {
              console.log("GETSTORELISTBYTYPEAPI---", res);
              this.getCodeWordshow = false;
            this.timer = setInterval(() => {
              this.times--;
              if (this.times === 0) {
                this.getCodeWordshow = true;
                this.times = 60;
                clearInterval(this.timer);
              }
            }, 1000);

          
            } else {
              this.$message.error(res.data.msg);
            }
          })
          .catch(function (err) {
            // this.$message.error("服务器错误，请检查！");
          });




          
      },
      agreePageFunc(type){// 1店铺 2账号
        // this.agreeShow = true;
  
        // this.agreeType = type;
        this.deleteAccountShow = false;
        this.mainDeleteStoreShow = false;
        this.mainQuitStoreShow = false;
        this.subQuitStoreShow = false;
        this.$router.push({
          path:'agree',
          query:{
            agreeType:type
          }
        })
      },
      deleteAccountFunc(){
        this.$message.warning('功能升级，暂停使用 ...');
        return;
        this.deleteAccountShow = true;
      },
      handleStoreChange(e) {
        console.log("银行名", e);
  
        this.transferStore = e;
      },
      mainQuitStoreFunc(){
        this.mainQuitStoreShow = true;
      },
      subQuitStoreFunc(){
        this.subQuitStoreShow = true;
      },
      
      onAgreeChange(e) {
        console.log(`checked = ${e.target.checked}`);
        this.agreeValue = e.target.checked;
      },
      
      handleMainQuitStoreOk(){
        this.mainQuitStoreShow = false;
      },
      handleSubQuitStoreOk(){
        this.subQuitStoreShow = false;
      },
      handleAccountDeleteOk(){
        this.deleteAccountShow = false;
        this.$message.warning('功能升级，暂停使用 ...');
      },
      handleMainDeleteStoreOk(){
        // this.agreeValue = false;
        
        if(!this.inputCode){
          return  this.$message.warning('请输入验证码');;
        }
        if(!this.agreeValue){
          return  this.$message.warning('请勾选协议');;
        }
  
        this.storeDeleteAPIFunc();
        this.mainDeleteStoreShow = false;
       
      },
  
      storeDeleteAPIFunc(){
  
  
  var jsonParams = {
    userId:this.userId,
    storeId:this.currentItem.id,
    telephone:this.phone,
    msgCode:this.inputCode
    };






          var jsonParams = {
                userId: this.cbUserId,
                token: this.cbToken,
                type: 1
             };
             console.log('aa-dsd---',jsonParams);

            this.$http
          .post(
            this.globalRequestUrl.storeLogoutAPI,
            this.qs.stringify(jsonParams)
          )
          .then((res) => {
            if (res.data.status == 200) {
              console.log("storeLogoutAPI---", res);
              console.log("storeLogoutAPI---", res);
              
                this.getStoreListFunc();
                this.$message.success('注销成功');
                this.inputCode = '';
                this.agreeValue = false;

          
            } else {
              this.$message.error(res.data.msg);
            }
          })
          .catch(function (err) {
            // this.$message.error("服务器错误，请检查！");
          });





  
  
  
  },
  
  
      handleCancel(){
        this.mainDeleteStoreShow = false;
      },
      mainDeleteStoreFunc(item){
        this.mainDeleteStoreShow = true;
        this.currentItem = item;
  
      },
      selectStoreClick(index) {
        this.selectStoreIndex = index;

        this.$store.commit("handleCbStoreInfo", JSON.stringify(this.storeList[index]));    

        this.$store.commit("setCbStoreId",this.storeList[index].id);      
        // this.$router
        //             .push("/home/publishMeal")
        //             .catch((err) => err);
        this.$router
                    .push("/publishMeal")
                    .catch((err) => err);
          

      },
  

  
  
      handleChange(info) {
        if (info.file.status === "uploading") {
          this.loading = true;
          return;
        }
        if (info.file.status === "done") {
          // Get this url from response in real world.
          getBase64(info.file.originFileObj, imageUrl => {
            this.imageUrl = imageUrl;
            console.log("图片base64数据为为", this.imageUrl);
            this.loading = false;
          });
        }
      },
      beforeUpload(file) {
        const isJpgOrPng =
          file.type === "image/jpeg" || file.type === "image/png";
        if (!isJpgOrPng) {
          this.$message.error("You can only upload JPG file!");
        }
        const isLt2M = file.size / 1024 / 1024 < 2;
        if (!isLt2M) {
          this.$message.error("Image must smaller than 2MB!");
        }
        return isJpgOrPng && isLt2M;
      },
      handleAreaChange() {},
      handleCateChange() {},
      saveFunc() {
        console.log("保存点击");
      },
    
      quitFunc() {
        var userPhone = this.cbUserPhone;
        window.localStorage.clear();
        this.$store.commit("setCbUserPhone", userPhone);   // 记住上次手机号
      this.$router.replace("/login");
        //   this.$store.commit('clearCommitData',"");
        // localStorage.removeItem("cbUserInfo"); // 用户基本信息
        // localStorage.removeItem("cbStoreInfo"); // 店铺信息
  
        // localStorage.removeItem("cbToken"); //
        // localStorage.removeItem("cbUserId");
        // localStorage.removeItem("cbStoreId");
        // localStorage.removeItem("cbStoreImage");
        // localStorage.removeItem("cbStoreName");
        // // localStorage.removeItem("activeIndex");
        // localStorage.removeItem("activeLink");
        // localStorage.removeItem("employeeUserId");
        // localStorage.removeItem("userType");
  
        // this.$router.replace("/login");
      },
      saveLocalInfo() {
        // var json = JSON.parse(window.localStorage.getItem("tempCbStoreInfo"));
  
        // window.localStorage.setItem(
        //   "cbStoreInfo",
        //   window.localStorage.getItem("tempCbStoreInfo")
        // ); // 存储某个店铺信息
         this.$store.dispatch("setCbStoreInfo",  window.localStorage.getItem("tempCbStoreInfo"));
  
        // window.localStorage.setItem(
        //   "cbStoreId",
        //   window.localStorage.getItem("tempCbStoreId")
        // ); // 存储某个店铺的id
         this.$store.dispatch("setCbStoreId",  window.localStorage.getItem("tempCbStoreId"));
  
        console.log("----店铺id为", window.localStorage.getItem("cbStoreId"));
        // window.localStorage.setItem(
        //   "cbStoreImage",
        //   window.localStorage.getItem("tempCbStoreImage")
        // );
         this.$store.dispatch("setCbStoreImage",  window.localStorage.getItem("tempCbStoreImage"));
  
        // window.localStorage.setItem(
        //   "cbStoreName",
        //   window.localStorage.getItem("tempCbStoreName")
        // );
          this.$store.dispatch("setCbStoreName",  window.localStorage.getItem("tempCbStoreName"));
  
        // window.sessionStorage.setItem("activeIndex", window.localStorage.getItem("tempActiveIndex")); // 选中第0个个导航索引
        window.sessionStorage.setItem(
          "activeLink",
          window.localStorage.getItem("tempActiveLink")
        ); // 选中第0个个导航索引
      }
    }
  };
  </script>
  
  <style lang='less' scoped>
  .nav_word_box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 30px;
    height: 55px;
    font-weight: bold;
    font-size: 18px;
    color: #282828;
    background-color: white;
  }
  .nav_word_text {
    display: inline-block;
    height: 55px;
    line-height: 55px;
  }
  
  .basic_info_content_box {
    background-color: white;
    width: 1080px;
    margin: 0 auto;
    /* height: 400px; */
    margin-top: 20px;
    min-height: 80vh;
    /* margin-bottom:20px; */
    border-radius: 4px;
    padding: 0 24px;
    padding-top: 24px;
  }
  .create_store_box{
    height: 96px;
    padding:24px;
    background: rgba(240, 242, 245, 1);
  display: flex;
  justify-content: space-between;
    border-radius: 4px;
    .create_left_box{
      display: flex;
      img{
        width: 48px;
  height: 48px;
  border-radius: 24px;
  
      }
      .create_store_name_box{
        display: flex;
        flex-direction: column;
        justify-content:center;
        margin-left: 8px;
        color:rgba(0, 0, 0, 0.85);
          font-size: 20px;
          font-weight: 500;
        .pwd_account_box{
          color:rgba(0, 0, 0, 0.45);
          font-size: 14px;
          font-weight: normal;
        }
      }
    }
    .create_right_box{
      color:white;
      width:96px;
      height: 40px;
      line-height:40px;
      border-radius:2px;
      background-color: rgba(24, 144, 255, 1);
      text-align: center;
      font-size: 16px;
    }
  }
  
  .store_word {
    height: 74px;
    line-height: 74px;
    color: #1d1d1d;
    font-size: 16px;
   
  }
  .basic_info_content_box ul {
    display: flex;
    flex-wrap: wrap;
  }
  .basic_info_content_box ul li {
    display: flex;
    flex-direction: column;
    // align-items: center;
    border: solid 1px #dfdcdd;
    border-radius: 4px;
    background-color: white;
    width: 336px;
    // height: 100px;
    // margin-right: 9px;
    width: calc(33.33% - 6px);
  margin-right: calc(6px * 3 / 2);
    margin-bottom: 9px;
    font-size: 16px;
    color: #1d1d1d;
  
    padding: 24px;
  }
  .basic_info_content_box ul li:nth-child(3n) {
  margin-right: 0;
  }
  .basic_info_content_box ul li img {
    border-radius: 25px;
    width: 50px;
    height: 50px;
    background-color: #cdcdcd;
    margin: 0px 10px 0 0px;
  }
  .quit_ {
    text-align: right;
    margin-right: 16px;
    font-size: 14px;
    font-weight: normal;
  }
  .loading_class{
    img[lazy="loading"] {
          zoom:0.5
    }
  
  }
  .close_store_box{
    text-align: right;
    color:rgba(0, 0, 0, 0.45);
  }
  .delete_info_box{
    display:flex;
    background:#FFFBE6;
    padding:9px 18px;
    color:rgba(0, 0, 0, 0.85);
    border-radius: 2px;
    border: 1px solid #FFE58F;
  }
  .code_box{
    display: flex;
    margin-top:24px;
    justify-content: space-between;
  
  }
  .get_code_btn{
    color:white;
      width:96px;
      height: 40px;
      line-height:40px;
      border-radius:2px;
      background-color: rgba(24, 144, 255, 1);
      text-align: center;
      font-size: 16px;
  }
  .code_right{
  display: flex;
  flex-direction: column;
  
  .input_code{
    display: flex;
    justify-content: space-between;
  }
  }
  .line_box{
    display: flex;
    align-items: center;
  }
  .account_mark{
    display: flex;
    flex-direction: column;
    margin-top: 24px;
  }
  .agree_content_box{
    margin-top: 30px;
    font-weight: 400;
  color: #000000;
    div{
      height:45px;
    }
  }
  .store_agree_content_box{
    font-size: 14px;
  color: #000000;
  div{
      margin-top:20px;
    }
  }
  </style>
  